/* lg */

@media (min-width: 1200px) {
  /* Make Navigation Toggle on Desktop Hover */
  #recent-works .container-fluid {
    padding-left: 8%;
  }
  .dropdown:hover:last-child .dropdown-menu {
    width: 120px !important;
    min-width: 120px;
  }
  .service-item {
    margin: 0 auto;
    max-width: 1300px;
  }
  .service-item .row div .col-md-7 img {
    width: 100%;
    height: 400px;
  }
  .service-item {
    padding-bottom: 70px;
  }
  .dropdown:hover .dropdown-menu {
    display: block;
    -webkit-animation: fadeInUp 400ms;
    animation: fadeInUp 400ms;
  }
  .container>.navbar-collapse {
    /* margin-right: 70px; */
    margin-left: 0;
  }
  #portfolio .row {
    margin-left: -10px;
    margin-right: -10px;
  }
  /* 产品 */
  .products #myTabContent div img {
    width: 221px;
    height: 177px;
  }
  #bottom {
    padding-bottom: 100px;
  }
  #bottom .center {
    padding-bottom: 20px;
  }
  #bottom .friend li {
    width: 18%;
  }
  #bottom .friend li img {
    width: 100%;
  }
  .service-item .news li div {
    width: 60%;
  }
  .service-item .news li {
    height: 137px !important;
  }
  .service-item .news li img {
    width: 146px;
    height: 95px;
  }
  #news_2 {
    height: 420px;
  }
}

/* md */

@media (min-width: 992px) and (max-width: 1199px) {
  #news_2 {
    height: 420px;
  }
  #footer .container {
    padding: 0;
    width: 100%;
  }
  #footer .container>div {
    margin-left: 0;
  }
  .service-item .row div .col-md-7 img {
    min-height: 350px;
    width: 100%;
  }
  .service-item .news li img {
    width: 35%;
  }
  .container>.navbar-collapse {
    margin-right: 70px;
    margin-left: 0;
  }
  #bottom {
    padding-top: 70px;
  }
  /* Make Navigation Toggle on Desktop Hover */
  .service-item .news {
    height: 225px !important;
  }
  .service-item .news li>a {
    padding: 15px 0 15px;
  }
  .service-item .news li {
    height: 115px !important;
  }
  .dropdown:hover .dropdown-menu {
    display: block;
    -webkit-animation: fadeInUp 400ms;
    animation: fadeInUp 400ms;
  }
  #feature .serviceItems>ul li {
    margin: 0px 10px 25px;
    width: 45%;
  }
  /* .navbar-collapse {
    padding-right: 15% !important;
  } */
  .navbar-nav>li {
    margin-left: 10px;
  }
  .navbar-collapse {
    padding-left: 0;
    padding-right: 0;
  }
  .recent-work-wrap .recent-work-inner h3 a {
    font-size: 20px;
  }
  .recent-work-wrap .overlay {
    padding: 15px;
  }
  .services-wrap {
    padding: 40px 10px 40px 30px;
  }
  .feature-wrap h2, .single-services h2 {
    font-size: 18px;
  }
  .feature-wrap h3, .single-services h3 {
    font-size: 14px;
  }
  .media .parrent.pull-left {
    clear: both;
    width: 100%;
  }
  .media .parrent.media-body {
    clear: both;
  }
  #portfolio .row {
    margin-left: -10px;
    margin-right: -10px;
  }
  .recent-work-wrap .overlay .preview {
    line-height: inherit;
  }
  .team-bar .first-arrow {
    width: 21%;
  }
  .team-bar .second-arrow {
    width: 20%;
  }
  .team-bar .third-arrow {
    width: 21%;
  }
  .team-bar .fourth-arrow {
    width: 20%;
  }
  ul.social_icons li {
    margin-right: 0;
  }
  .products {
    height: 800px;
  }
  #footer {
    margin-top: 100px;
  }
  #bottom .center {
    padding-bottom: 20px;
  }
  #bottom .friend ul li {
    width: 31%;
    margin: 10px 10px;
  }
  #bottom .friend li img {
    width: 100%;
  }
  #header .navbar-header {
    width: 10%;
  }
  #header .navbar-header .navbar-brand img:last-child {
    display: block;
    width: 100%;
  }
  #header .navbar-header .navbar-brand {
    margin-top: 0;
  }
}

/* sm */

@media (min-width: 768px) and (max-width: 991px) {
  .service-item .row div:nth-child(1) .col-md-7 img {
    height: 360px;
  }
  .service-item #myTabContent>div {
    padding: 0 100px;
  }
  .tab-content img {
    width: 100%;
  }
  /* Make Navigation Toggle on Desktop Hover */
  .products {
    height: 700px;
  }
  .service-item .col-md-5 {
    padding: 40px 50px;
  }
  .service-item .news {
    height: 380px !important;
  }
  .dowebok {
    height: 410px !important;
  }
  .service-item .news li {
    height: 192px !important;
  }
  /* .service-item .news li div {
    padding-top: 20px;
  } */
  .service-item .news li img {
    /* width: 272px;
    height: 177px; */
    width: 230px;
    height: 150px;
  }
  .service-item .news li div>P {
    overflow: auto;
    text-overflow: ellipsis;
    white-space: normal
  }
  .dropdown:hover .dropdown-menu {
    display: block;
    -webkit-animation: fadeInUp 400ms;
    animation: fadeInUp 400ms;
  }
  #recent-works .container-fluid {
    padding-left: 5%;
  }
  #recent-works .products .row>div img {
    width: 60%;
  }
  #feature .serviceItems>ul li {
    margin: 0px 10px 24px;
    width: 43%;
  }
  #feature .forest-fire {
    left: 0px;
    margin-top: -58px;
  }
  #feature .forest-fire h3 {
    font-size: 18px;
    width: 125px;
  }
  #feature .forest-fire {
    line-height: 120px;
  }
  .container>.navbar-collapse {
    margin-right: 70px;
    margin-left: 0;
  }
  .navbar-collapse {
    padding-left: 0;
    padding-right: 0;
  }
  .navbar-collapse {
    padding-right: 10% !important;
  }
  .navbar-nav>li {
    margin-left: 0;
  }
  #main-slider .carousel h1 {
    font-size: 25px;
  }
  #main-slider .carousel h2 {
    font-size: 20px;
  }
  .media .parrent.pull-left, .media.accordion-inner .pull-left {
    clear: both;
    width: 100%;
  }
  .media .parrent.media-body, .media.accordion-inner .media-body {
    clear: both;
  }
  .services-wrap {
    padding: 40px 0 40px 30px;
  }
  .recent-work-wrap .overlay {
    padding: 15px;
  }
  .recent-work-wrap .recent-work-inner h3 a {
    font-size: 20px;
  }
  .sinlge-skill {
    width: 150px;
    height: 150px;
  }
  .sinlge-skill p em {
    font-size: 25px;
  }
  .sinlge-skill p {
    font-size: 16px;
  }
  .team-bar .first-one-arrow {
    width: 2%;
  }
  .team-bar .first-arrow {
    width: 18%;
  }
  .team-bar .second-arrow {
    width: 24%;
  }
  .team-bar .third-arrow {
    width: 15%;
  }
  .team-bar .fourth-arrow {
    width: 20%;
  }
  .blog .blog-item .entry-meta>span a {
    font-size: 10px;
  }
  #bottom .friend ul li {
    width: 45%;
    margin: 10px 10px;
  }
  #bottom .friend li img {
    width: 100%;
  }
  .service-item .col-md-7 {
    padding: 0 20px;
  }
  .service-item .col-md-5 {
    padding: 40px 20px;
  }
}

/* xs */

@media (max-width:830px) {
  #recent-works .products .row>div {
    margin-right: 0;
  }
}

@media (max-width: 767px) and (min-width: 481px) {
  .service-item .row {
    /* padding: 40px 20px 0 25px; */
    margin-right: 20px;
  }
  #feature .forest-fire {
    height: 64px;
  }
  #feature .forest-fire {
    width: 100%;
  }
  #feature .row {
    margin: 0 !important;
  }
  .hrLine {
    width: 30% !important;
  }
  #footer .container>div {
    margin-left: 0;
  }
  body>section {
    padding: 0px 0;
  }
  .serviceItems>div {
    width: 32%;
  }
  #feature .serviceItems>div.col-md-4 img {
    width: 100%;
  }
  .service-item .col-md-5 {
    padding: 40px 0;
  }
  .service-item .col-md-7, .service-item .col-md-5 {
    padding-left: 25px;
  }
  .dowebok {
    height: 310px !important;
  }
  .service-item .news {
    height: 310px !important;
  }
  .service-item .news{
    width: 100%;
  }
  .service-item .news li {
    height: 165px !important;
    width: 100%
  }
  .service-item .news li img {
    width: 215px;
    height: 123px;
  }
  .service-item .news li div {
    width: 49%;
  }
  .container>.navbar-header, .container>.navbar-collapse {
    margin-left: 0;
  }
  #recent-works .products .row>div div span {
    font-size: 12px;
  }
  #recent-works hr {
    width: 28%;
  }
  #feature .serviceItems>ul {
    width: 62%;
    margin-left: 20px;
  }
  #feature .serviceItems>ul li {
    width: 49%;
    float: none;
    display: inline-block;
    margin: 0;
  }
  #feature .serviceItems>ul li:first-child {
    margin-bottom: 20px;
  }
  #feature .serviceItems>ul li img {
    width: 100%;
  }
  #feature .serviceItems>ul li div {
    width: 100%;
  }
  #header .navbar-header {
    width: 100%;
  }
  #header .navbar-header .navbar-brand {
    margin-top: 0;
    width: 70%;
  }
  .navbar-toggle {
    margin-top: 20px;
    margin-right: 60px;
    padding: 10px 10px;
  }
  .navbar-inverse .navbar-toggle {
    border: 1px solid #fff;
  }
  .navbar-right {
    background: #0b6dd1;
  }
  .navbar-right>ul {
    height: 500px;
  }
  #header .navbar-collapse {
    max-height: 500px;
  }
  #main-slider .carousel .carousel-content {
    display: block;
    margin-left: auto;
    margin-right: auto;
  }
  #main-slider .carousel .carousel-content img:first-child {
    width: 232px;
    height: 25px;
  }
  #main-slider .carousel .carousel-content img:nth-child(2) {
    width: 232px;
    height: 20px;
  }
  #main-slider .carousel .carousel-content img:nth-child(3) {
    width: 232px;
    height: 20px;
  }
  .top-number {
    font-size: 14px;
  }
  input.search-form:hover {
    width: 120px;
  }
  .navbar-nav>li {
    padding-bottom: 0;
  }
  #main-slider .carousel h1 {
    font-size: 25px;
  }
  #main-slider .carousel h2 {
    font-size: 16px;
  }
  .feature-wrap h2, .single-services h2 {
    font-size: 18px;
  }
  .feature-wrap h3, .single-services h3 {
    font-size: 14px;
  }
  .media.accordion-inner .pull-left, .media.accordion-inner .media-body {
    clear: both;
  }
  .accordion-inner h4 {
    margin-top: 10px;
  }
  .media .pull-left {
    clear: both;
    width: 100%;
  }
  .media .media-body {
    clear: both;
  }
  .nav-tabs>li.active>a:after {
    display: none;
  }
  #footer .col-sm-6 {
    text-align: center;
  }
  #footer .pull-right {
    float: none !important;
  }
  .sinlge-skill {
    margin: 0 auto;
    margin-top: 30px;
    margin-bottom: 30px;
  }
  .team .single-profile-top, .team .single-profile-bottom {
    margin-bottom: 30px;
  }
  .products .nav>li {
    padding: 0px 15px;
  }
  .clients-area {
    padding: 60px 0;
  }
  .clients-area h1 {
    font-size: 25px;
  }
  .portfolio-item, #recent-works .col-xs-12.col-md-3 {
    padding: 0 15px;
  }
  ul.social_icons li {
    margin-right: 0;
  }
  .blog .blog-item .entry-meta {
    margin-bottom: 20px;
  }
  .blog .blog-item .blog-content h3 {
    margin-bottom: 20px;
  }
  .post_reply_comments {
    padding-left: 20px;
  }
  .service-item .col-md-5 div:first-child>a p {
    overflow: auto;
    text-overflow: ellipsis;
    white-space: normal
  }
  #bottom .friend ul li {
    width: 43%;
    margin: 10px 10px;
  }
  #bottom .friend li img {
    width: 100%;
  }
  .navbar-inverse .navbar-nav .dropdown-menu {
    width: 100% !important;
  }
  .navbar-inverse .navbar-collapse {
    padding: 0;
  }
  .navbar-inverse .navbar-nav>li>a {
    display: block;
  }
  .navbar-inverse .navbar-collapse .navbar-nav {
    padding: 10px;
  }
  .serviceItems>div div p {
    color: #fff;
  }
  .serviceItems>div div {
    -webkit-animation: fadeInUp 500ms linear both;
    -moz-animation: fadeInUp 500ms linear both;
    -o-animation: fadeInUp 500ms linear both;
    -ms-animation: fadeInUp 500ms linear both;
    animation: fadeInUp 500ms linear both;
  }
  #feature .serviceItems>ul li div {
    -webkit-animation: fadeInUp 300ms linear both;
    -moz-animation: fadeInUp 300ms linear both;
    -o-animation: fadeInUp 300ms linear both;
    -ms-animation: fadeInUp 300ms linear both;
    animation: fadeInUp 300ms linear both;
  }
}

@media (max-width: 686px) {
  .products .nav>li {
    padding: 0px 45px;
  }
  #footer .footer-bottom p {
    background-position: 5% 10px;
  }
  #recent-works .products .row>div {
    width: 40%;
    margin: 20px 20px 0;
  }
  #recent-works .products .row>div img {
    width: 60%;
  }
  .products {
    height: 1050px;
  }
}

/* XS Portrait */

@media (max-width: 480px) {
  .tab-content img {
    width: 100%;
  }
  #feature .forest-fire {
    width: 100%;
    height: 64px;
  }
  #feature .serviceItems>ul li div {
    width: 100%;
  }
  #bottom .fadeInDown .hrLine {
    width: 24%;
  }
  #footer .footer-bottom p {
    background-position: 35px 10px;
  }
  .navbar-toggle {
    margin-right: 12px;
    padding: 5px;
    border-color: #fff !important;
  }
  #feature hr {
    width: 25% !important;
  }
  #recent-works hr {
    width: 25%;
  }
  #recent-works .products .nav {
    margin-bottom: 0;
  }
  .products {
    height: 900px;
  }
  .service-item .news li div>P {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
  }
  .service-item .col-md-5 {
    padding: 40px 0;
  }
  .service-item .col-md-7, .service-item .col-md-5 {
    padding-left: 25px;
  }
  #feature .serviceItems>ul li {
    width: 100%;
    margin: 0;
  }
  #recent-works .products .row>div {
    width: 37%;
    margin: 20px 20px 0;
    float: left;
  }
  #bottom .friend ul li {
    width: 100%;
  }
  #bottom .friend ul li img {
    width: 90%;
  }
  #bottom .friend {
    position: static;
  }
  #bottom .friend ul {
    position: static;
    margin-left: 0;
    margin-bottom: 30px;
  }
  #footer dl {
    float: left;
    padding: 10px 15px;
  }
  #footer .container>div {
    margin-left: 0px;
  }
  .dowebok {
    height: 250px !important;
  }
  .service-item .news {
    height: 250px !important;
  }
  .service-item .news li img {
    width: 135px;
    height: 88px;
  }
  .service-item .news li {
    height: auto !important;
  }
  .service-item .news li div {
    max-width: 240px;
    width: 52%;
  }
  .service-item .col-md-5 div:first-child>a p {
    overflow: auto;
    text-overflow: ellipsis;
    white-space: normal
  }
  #feature .row {
    /* margin-left: -15px !important; */
    margin: 0;
    padding: 0 30px;
  }
  #header .navbar-header {
    width: 100%;
  }
  #header .navbar-header .navbar-brand {
    margin: 0;
  }
  #header .navbar-header .navbar-brand {
    width: 80%;
  }
  #bottom .friend ul li {
    margin: 10px;
  }
  .service-item .fadeInDown .hrLine {
    width: 25%;
  }
  #feature .serviceItems>div.col-md-4 img {
    width: 100%;
    max-height: 230px;
  }
  #feature .serviceItems>ul li img {
    width: 100%;
    max-height: 230px;
  }
  #footer dl {
    width: 142px;
  }
  .navbar-inverse .navbar-collapse .navbar-nav {
    background: #0b6dd1;
    padding: 10px;
  }
  .navbar-collapse {
    max-height: 500px !important;
  }
  .navbar-inverse .navbar-collapse {
    padding: 0;
  }
  .navbar-inverse .navbar-nav>li>a {
    display: block;
  }
  .navbar-inverse .navbar-nav .dropdown-menu {
    width: 100% !important;
  }
  .serviceItems>div div p {
    color: #fff;
  }
  .serviceItems>div div {
    -webkit-animation: fadeInUp 500ms linear both;
    -moz-animation: fadeInUp 500ms linear both;
    -o-animation: fadeInUp 500ms linear both;
    -ms-animation: fadeInUp 500ms linear both;
    animation: fadeInUp 500ms linear both;
  }
  #feature .serviceItems>ul li div {
    -webkit-animation: fadeInUp 300ms linear both;
    -moz-animation: fadeInUp 300ms linear both;
    -o-animation: fadeInUp 300ms linear both;
    -ms-animation: fadeInUp 300ms linear both;
    animation: fadeInUp 300ms linear both;
  }
}